<template>
	<view class="graphics-back">
		<text class="graphics-Title">请详细描述你的病情</text>
		<textarea placeholder="为了更好获得医生帮助,请尽可能详细描述病情" maxlength="300" placeholder-class="textarea-color"
			:auto-focus="true" />
	</view>
	<!-- 指导用药 -->
	<view class="graphics-back">
		<checkbox-group @change="checkboxChange">
			<label>
				<checkbox value="cb" :checked="true" color="#0176ff" />需要医生指导用药
			</label>
		</checkbox-group>
	</view>
	<!-- 上传图片 -->
	<view class="graphics-back">
		<text class="graphics-Title">上传检查报告或患处照片</text>
		<view class="pat-image">
			<view class="upload-Image">
				<image src="" mode="aspectFill"></image>
				<image src="/static/other/shanchu-goods.svg" mode="widthFix"></image>
			</view>
			<view>
				<image src="/static/other/shuxing-img.png" @click="upload" mode="aspectFill"></image>
			</view>
		</view>
	</view>
	<!-- 选择就诊人 -->
	<view class="graphics-back">
		<text class="graphics-Title">选择就诊人</text>
		<view class="patient-view">
			<image src="/static/other/touxiang.svg" mode="widthFix"></image>
			<text>李四</text>
			<text @click="choosePatient">选择就诊人</text>
		</view>
	</view>
	<!-- 提交 -->
	<view style="height:300rpx"></view>
	<view class="submit">
		<text @click="canCel">取消</text>
		<text @click="subMit">提交</text>
	</view>
</template>
  
<script setup lang="ts">
// 1.引入基础模块
import { reactive, toRefs, ref } from 'vue'

function choosePatient() {
	console.log('111')
	uni.navigateTo({ url: "/pages/myPatient/myPatient" })
}

</script>
  
  
<style>
/* 表单提交 */
@import url('../../common-style/form.css');

page {
	background-color: #fafafa;
}

.graphics-back {
	background-color: #ffffff;
	margin: 20rpx;
	padding: 20rpx;
	border-radius: 10rpx;
}

.graphics-Title {
	font-size: 35rpx;
	font-weight: bold;
	display: block;
	padding-bottom: 20rpx;
}

textarea {
	width: 100%;
	height: 250rpx;
}

.textarea-color {
	color: #00c8c8;
}

/* 上传图片 */
.pat-image {
	display: flex;
	flex-wrap: wrap;
}

.pat-image view {
	width: calc(33.3% - 5rpx*2);
	height: 200rpx;
	margin: 5rpx;
}

.pat-image image {
	width: 100%;
	height: 100%;
	display: block;
	border-radius: 7rpx;
}

.upload-Image {
	position: relative;
}

.upload-Image image:nth-child(2) {
	width: 30rpx !important;
	height: 30rpx !important;
	position: absolute;
	top: 0;
	right: 0;
}

/* 选择就诊人 */
.patient-view {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.patient-view image {
	width: 120rpx;
	height: 120rpx;
}

.patient-view text:nth-child(2) {
	flex: 1;
	padding: 0 50rpx;
	font-weight: bold;
}

.patient-view text:nth-child(3) {
	color: #2c76ef;
}
</style>